<script lang="ts" setup>
import type { RoutingModel } from '#/api/process/models';

import { ref } from 'vue';

import { Page } from '@vben/common-ui';

import Routing from './routing/list.vue';
import RoutingStep from './step/list.vue';

const selected = ref<RoutingModel>();
</script>

<template>
  <Page auto-content-height>
    <div class="flex h-full w-full">
      <div class="h-full w-3/12">
        <Routing v-model:selected="selected" />
      </div>
      <div class="ml-2 w-9/12">
        <RoutingStep :line-id="selected?.lineId" :routing-id="selected?.id" />
      </div>
    </div>
  </Page>
</template>

<style lang="scss" scoped>
.isActive {
  background-color: #1890ff;
}
</style>
